

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>修改员工表单</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
</head>
<body>

<form id="myeditform" class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">
    <!--  id在页面中隐藏了，前端传递给后端也传递了employee_id值  -->
    <input type="hidden" name="id">
    <!--登陆账号-->
    <div class="layui-form-item">
        <label class="layui-form-label required">登陆账号</label>
        <div class="layui-input-inline">
            <input type="text" name="username" lay-verify="required" placeholder="请输入员工姓名" autocomplete="off" class="layui-input">
        </div>
    </div>
    <!--用户名称-->
    <div class="layui-form-item">
        <label class="layui-form-label required">用户名称</label>
        <div class="layui-input-inline">
            <input type="text" name="nickname" lay-verify="required" placeholder="请输入员工姓名" autocomplete="off" class="layui-input">
        </div>
    </div>
    <!--登陆密码-->
    <div class="layui-form-item">
        <label class="layui-form-label required">登陆密码</label>
        <div class="layui-input-inline">
            <input type="text" name="password" lay-verify="required" placeholder="请输入员工姓名" autocomplete="off" class="layui-input">
        </div>
    </div>


    <!--受教育的程度-->
    <div class="layui-form-item">
        <label class="layui-form-label">角色</label>
        <div class="layui-input-inline">
            <select name="role" id="role">
                <option value="">--请选择--</option>
            </select>
        </div>
    </div>




    <!--受教育的程度-->
    <div class="layui-form-item">
        <label class="layui-form-label">是否启用</label>
        <div class="layui-input-inline">
            <select name="state">
                <option value="0">启用</option>
                <option value="1">未启用</option>
            </select>
        </div>
    </div>


    <!--确认提交-->
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="LAY-user-front-submit" id="LAY-user-back-submit" value="确认">
    </div>
</form>

<!--引入本地layui.js-->
<script src="../../static/layui/layui.js"></script>
<script src="../../static/js/jquery-3.6.0.min.js"></script>
<!--js-->
<script type="text/javascript">
    layui.config({
        base: '../../static/layui/layuiadmin/' //静态资源所在路径js
    }).extend({
        index: 'lib/index' //主入口模块
    }).use('index');
</script>


</script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
    layui.use(['form', 'layedit', 'laydate'], function() {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate;
        $.ajax({
            url: '/system/userManagementFindRoleServlet',
            dataType: 'json',
            type: 'get',
            success: function (data) {
                console.log(data);//下面会提到这个data是什么值
                //使用循环遍历，给下拉列表赋值
                $.each(data.data, function (index, value) {
                    //console.log(value.id);
                    $('#role').append(new Option(value.role_name,value.role_id));// 下拉菜单里添加元素
                    //$('#cardType').
                });
                layui.form.render("select");//重新渲染 固定写法
            }
        })

    })
</script>
<!--<script>-->
<!--    var ids=['1','2','3'];-->
<!--    var names=['流域','河段','水系'];-->
<!--    var select= document.getElementById('role');-->
<!--    for (var i=0;i<ids.length;i++) {-->
<!--        var option = document.createElement("option");-->
<!--        option.setAttribute("value", ids[i]);-->
<!--        option.innerText = names[i];-->
<!--        select.appendChild(option)-->
<!--    };-->
<!--    //渲染下拉框-->
<!--    layui.use('form', function () {-->
<!--        var form = layui.form;-->
<!--        form.render("select");-->
<!--    });-->
<!--</script>-->


</body>
</html>


</body>
</html>